 <template>
  <!-- 工作汇报详情 -->
  <div id="container">
    <el-collapse v-model="activeNames" v-loading="loading">
      <el-collapse-item title="基本信息" name="1">
        <daily-data ref="detail" :form="dailyDetail"></daily-data>
      </el-collapse-item>
      <el-collapse-item title="评论" name="2">
        <comment ref="comment" :type="26"></comment>
      </el-collapse-item>
    </el-collapse>
  </div>
</template>
<script>
import dailyData from './components/dailyDetail.vue'
import comment from '@/components/comments'
export default {
  name: 'dailyDetail',
  data () {
    return {
      activeNames: ['1', '2'],
      checkCofig: [],
      loading: false,
      dailyDetail: {},
    }
  },
  components: {
    dailyData,
    comment
  },

  mounted () {
    this.getDetail()
  },

  methods: {
    async getDetail () {
      this.loading = true
      let { data } = await this.$API.daily.getDailyById.post({ id: this.$route.query.id })
      this.dailyDetail = data
      this.$refs.comment.getCommentList()
      this.loading = false
    },

  }
}
</script>
<style lang='scss' scoped>
#container {
  height: 100%;
  margin: 10px;

  :deep(.el-collapse-item__header) {
    padding-left: 20px;
    font-size: 16px;
  }
  :deep(.el-collapse-item__content) {
    padding: 0 20px 20px 20px;
  }
  :deep(.el-form-item) {
    margin-bottom: 5px;
  }
  :deep(.el-form-item__label) {
    color: #999;
  }
}
</style>